<template>
	<!-- 设备详情 -->
	<view>
		<view class="_subsection"><u-subsection :list="list" :current="current" @change="changeIndex"></u-subsection></view>
		<view class="" v-show="current == 0">
			<list-item showBorderBottom leftName="设备名称">
				<view class="_item" slot="center"><text>终端A</text></view>
			</list-item>
			<list-item showBorderBottom leftName="MAC地址">
				<view class="_item" slot="center"><text>55-12-34-56-78-90</text></view>
			</list-item>
			<list-item showBorderBottom leftName="车辆编号">
				<view class="_item" slot="center"><text>6A33</text></view>
			</list-item>
			<list-item showBorderBottom leftName="车牌号码">
				<view class="_item" slot="center"><text>湘A52008</text></view>
			</list-item>
			<list-item showBorderBottom leftName="4G卡信号">
				<view class="_item" slot="center"><text>25</text></view>
			</list-item>
			<list-item showBorderBottom leftName="DTMB信号">
				<view class="_item" slot="center" style="margin-left: 60rpx;"><text>25</text></view>
			</list-item>
		</view>
		<view class="" v-show="current == 1">
			<u-table>
				<u-tr>
					<u-th>屏幕号</u-th>
					<u-th>状态码</u-th>
					<u-th>状态说明</u-th>
					<u-th>地址码</u-th>
				</u-tr>
				<u-tr v-for="(item, index) in list2" :key="index">
					<u-td v-for="(item2, index2) in item" :key="index2">{{ item2 }}</u-td>
				</u-tr>
			</u-table>
			<view class="_location">
				<text>屏幕位置示意图：</text>
				<screenDiagram></screenDiagram>
			</view>
		</view>

		<view class="positon_bottom" v-if="current == 0">
			<u-button v-if="showRebot" type="error" shape="circle" style="width: 600rpx;" open-type="getUserInfo" @getuserinfo="login">立即重启</u-button>
			<view class="bottom-operation" v-if="showOperation">
				<u-button type="primary" style="width: 200rpx;">重新扫码</u-button> 
				<u-button type="primary" style="width: 200rpx;">确认提交</u-button> 
			</view>
		</view>
	</view>
</template>

<script>
import listItem from '../reportRepair/components/list-item.vue';
import screenDiagram from '../../components/screen-diagram/index.vue';
export default {
	components: {
		listItem,
		screenDiagram
	},
	data() {
		return {
			action:0,
			list: [
				{
					name: '机顶盒'
				},
				{
					name: '屏幕'
				}
			],
			list2: [['1号屏', '0', '正常', '11'], ['2号屏', '0', '正常', '12'], ['3号屏', '0', '正常', '13'], ['4号屏', 'x', '未提交状态', '14'], ['5号屏', '50', '通信故障', '15']],
			current: 0
		};
	},
	onLoad(e) {
		console.log(e.content,'进入页面传入的参数')
	},
	methods: {
		changeIndex(index) {
			console.log(index);
			this.current = index;
		}
	}
};
</script>

<style lang="scss" scoped>
._subsection {
	width: 400rpx;
	margin: 40rpx auto;
	height: 80rpx;
}
._item {
	margin-left: 80rpx;
	text {
		font-size: 26rpx;
		color: #7f7f7f;
	}
}
.positon_bottom {
	position: fixed;
	bottom: env(safe-area-inset-bottom);
	left: 0;
	right: 0;
	height: 140rpx;
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
	.bottom-operation{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		margin: 0 50rpx;
	}
}
._location{
	margin-top: 30rpx;
}
</style>
